<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>新增-职员信息</title>
    <link rel="stylesheet" th:href="@{/resources/bootstrap/css/bootstrap.min.css}">
    <!-- Font Awesome -->
    <link rel="stylesheet" th:href="@{/resources/awi/css/font-awesome.min.css}">
    <!-- Theme style -->
    <link rel="stylesheet" th:href="@{/resources/awi/css/AdminLTE.min.css}">
    <link rel="stylesheet" th:href="@{/resources/awi/css/skins/all-skins.min.css}">
    <link rel="stylesheet" th:href="@{/resources/plugins/ztree/css/ztreeStyle/ztreeStyle.css}">
</head>
<body>
<div class="container-fluid">
    <div class="row">
        <div class="col-md-12">
            <div class="page-header">
                <h3>职员信息
                    <small>职员信息-修改</small>
                </h3>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-md-10 col-md-offset-1">
            <div class="box box-solid box-info">
                <div class="box-body">
                    <form role="form" id="clerk-form" action="/clerk/save" method="post">
                        <input type="hidden" name="uid" id="uid">
                        <div class="form-group">
                            <label for="realName">真实姓名 </label>
                            <input class="form-control" name="realName" id="realName" placeholder="真实姓名">
                        </div>
                        <div class="form-group">
                            <label for="phoneNo">联系电话 </label>
                            <input class="form-control" name="phoneNo" id="phoneNo" placeholder="联系电话">
                        </div>
                        <div class="form-group">
                            <label for="email">邮箱 </label>
                            <input class="form-control" name="email" id="email" placeholder="邮箱">
                        </div>
                        <div class="form-group">
                            <label for="departmentUid">部门 </label>
                            <input type="hidden" name="departmentUid" id="departmentUid">
                            <input class="form-control" name="department" id="department" placeholder="点击设置部门"
                                   readonly onclick="setDepartment()">
                        </div>
                        <div class="form-group">
                            <label for="positionUid">职位 </label>
                            <select class="form-control" name="positionUid" id="positionUid"></select>
                        </div>
                        <div class="form-group">
                            <label for="stationUid">岗位 </label>
                            <select class="form-control" name="stationUid" id="stationUid"></select>
                        </div>
                        <div class="form-group">
                            <label for="status">用户状态 </label>
                            <input class="form-control" name="status" id="status" placeholder="用户状态">
                        </div>
                    </form>

                </div>
                <div class="box-footer">
                    <button type="button" id="submitBtn" class="btn btn-primary pull-right" style="margin-left: 35px;"
                            onclick="submitForm('#clerk-form')">提交
                    </button>
                    <button type="button" id="resetBtn" class="btn btn-warning pull-right"
                            onclick="resetForm('#clerk-form')">重置
                    </button>
                </div>
            </div>


        </div>

    </div>

</div>
</body>
<!-- jQuery 2.2.3 -->
<script th:src="@{/resources/plugins/jQuery/jquery-2.2.3.min.js}"></script>
<!-- Bootstrap 3.3.6 -->
<script th:src="@{/resources/bootstrap/js/bootstrap.min.js}"></script>
<script th:src="@{/resources/layer/layer.js}"></script>
<script th:src="@{/resources/plugins/ztree/js/jquery.ztree.all.js}"></script>
<script th:src="@{/resources/commons/js/prototype.js}"></script>
<script th:inline="javascript">
    $(function(){
        $.get("/position/list",function (response) {
            $.each(response.data,function(index,item){
                $("#positionUid").append('<option value="'+item.uid+'">'+item.name+'</option>');
            });
        })
        $.get("/station/list",function (response) {
            $.each(response.data,function(index,item){
                $.each(response.data,function(index,item){
                    $("#stationUid").append('<option value="'+item.uid+'">'+item.name+'</option>');
                });
            });
        })
    })
    function setDepartment(){
        var setting = {
            check: {
                enable: true,
                chkStyle: "radio",
                radioType: "all"
            },
            callback: {
                onCheck: parentCheck
            },
            data: {
                simpleData: {
                    enable: true
                }
            }
        };
        $.get("/department/listDepartmentTree",function(response){
            layer.open({
                title:'请选择部门',
                content:'<ul class="ztree" id="department-tree"></ul>',
                area:['300px','400px']
            });
            var ztree=$.fn.zTree.init($("#department-tree"), setting, response.data);
        })
    }
    function parentCheck(event, treeId, treeNode) {
        $("#departmentUid").val(treeNode.id);
        $("#department").val(treeNode.name);
    };

    //初始化编辑表单数据
    var formData = [[${formData}]];
    formDataInit(formData);
</script>
</html>